<template>
	<!-- 公司主页 -->
	<view class="">
		<view class="homepage">
			<view class="top flex_sb flex_ac">
				<view class="flex1 overflow_1 ">
					<view class="flex_ac overflow_1">
						<view class="f32 flex1 fb overflow_1">
							{{data.name}}
						</view>
						<view class="grbj" v-if="data.user_id == user.id"
							@click="$wanlshop.to('/pages/craftsman/craftsmanAdd?entrance=bj&type='+data.type)">
							编辑
						</view>
					</view>

					<view class="mt24">
						<u-tag text="企业认证" mode="light" type="primary" class="mr12" />
						<u-tag :text="data.work_time + '年'" mode="dark" type="warning" class="mr12" />
					</view>
					<view class="info f24 mt24 flex_ac">
						<view class="">
							评分 <text class="cf64 fb">{{data.score}}</text>
						</view>
						<view class="aa">

						</view>
						<view class="">
							接单量 <text class="primary  fb">{{data.order}}</text>
						</view>
					</view>
				</view>
				<view class="ml24">
					<image class="touxiang" :src="$wanlshop.oss(data.avatar)" mode=""></image>
				</view>
			</view>
			<image class="imgtitle" src="https://img.aibbyp.com/wechatUser/craftsman/qyjs.png" mode=""></image>
			<view class="concat">
				{{data.company_des}}
			</view>
			<view v-if="data.service_content">
				<image class="imgtitle" src="https://img.aibbyp.com/wechatUser/craftsman/funr.png" mode=""></image>
				<view class="concat">
					{{data.service_content}}
				</view>
			</view>
			<view v-if="data.file_images && data.file_images.length>0">
				<image class="imgtitle" src="https://img.aibbyp.com/wechatUser/craftsman/jyzp.png" mode=""></image>
				<view class="flex_sb flex-wrap mt24">
					<image class="imgs" @click="previewImage(k,data.file_images)" v-for="(i,k) in data.file_images"
						:key="i" :src="$wanlshop.oss(i)" mode=""></image>
				</view>
			</view>

		</view>
		<view class="bottomBtn flex" v-if="option.user">
			<view class="flex_y_x_center" @tap="toChat(data.user_id,'',data.user_id)">
				<u-icon size="40" name="https://img.aibbyp.com/wechatUser/craftsman/liaotian.png"></u-icon>
				<view class="liaotian mt8 f24">
					聊天
				</view>
			</view>
			<view class="flex1 sqbd" @click.sotp='applyfor(data, index)'>
				申请绑定
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: '',
				option: '',
				user: uni.getStorageSync('wanlshop:user')

			}
		},
		onLoad(option) {

			this.option = option
			this.getworkerHome()

		},
		methods: {
			previewImage(k, data) {
				let urls = data.map(a => this.$wanlshop.oss(a))
				uni.previewImage({
					urls: urls,
					current: k,
					indicator: 'number',
				});
			},
			getworkerHome() {
				this.$api.post({
					url: '/worker/user_join/workerHome',
					data: {
						id: this.option.id
					},
					loadingTip: '加载中...',
				}).then(res => {
					this.data = res
				})
			},
			applyfor(item, key) { //申请绑定
				console.log(item);
				let _this = this
				_this.$api.post({
					url: '/worker/user_join/needJoin',
					data: {
						id: item.id
					},
					loadingTip: '申请中...',
					success: res1 => {
						uni.showToast({
							icon: 'none',
							title: '已申请'
						})
					}
				})

			},

		},
	}
</script>

<style lang="scss" scoped>
	.bottomBtn {
		position: fixed;
		bottom: 0;
		background: #fff;
		z-index: 2;
		width: 100vw;
		box-sizing: border-box;
		padding: 20rpx 46rpx;

		.sqbd {
			background: #FD5241;
			border-radius: 200rpx 200rpx 200rpx 200rpx;
			font-size: 40rpx;
			color: #FFFFFF;
			margin-left: 46rpx;
			text-align: center;
			font-weight: bold;
			height: 80rpx;
			line-height: 80rpx;

		}
	}

	.homepage {
		background-image: url('https://img.aibbyp.com/wechatUser/craftsman/bjs2.png');
		background-size: 750rpx 550rpx;
		background-repeat: no-repeat;
		padding: 44rpx 44rpx 144rpx;
		background-color: #fff;
		min-height: 100vh;

		.grbj {
			font-size: 24rpx;
			color: #3D3D3D;
			background: #EEEEEE;
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			padding: 4rpx 20rpx;
			margin-left: 12rpx;
		}

		.top {
			background: #FFFFFF;
			box-shadow: 0rpx 8rpx 40rpx 0rpx rgba(129, 129, 129, 0.1);
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			padding: 32rpx 42rpx;
		}

		.imgtitle {
			width: 150rpx;
			height: 56rpx;
			margin-top: 42rpx;
		}



		.concat {
			background: #F2F7FF;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			padding: 36rpx 26rpx;
			margin-top: 20rpx;
		}

		.imgs {
			width: 300rpx;
			height: 168rpx;
			border-radius: 12rpx;
			margin-bottom: 32rpx;
			border: 1rpx #ccc dashed;
		}

		.touxiang {
			width: 146rpx;
			height: 146rpx;
			border-radius: 50%;
		}

		.aa {
			width: 1rpx;
			height: 20rpx;
			margin: 0 20rpx;
			background: #909399;
		}
	}
</style>